<template>


  <div>
    <el-form ref="form" :model="form" label-width="80px">
      <el-form-item label="银行名称">
        <el-input v-model="form.bankName"></el-input>
      </el-form-item>
      <el-form-item label="银行卡号">
        <el-input v-model="form.cardNumber"></el-input>
      </el-form-item>
      <el-form-item label="额度">
        <el-input v-model="form.amount"></el-input>
      </el-form-item>
      <el-form-item label="账单日">
        <el-input v-model="form.billDay"></el-input>
      </el-form-item>
      <el-form-item label="还款日">
        <el-input v-model="form.repaymentDay"></el-input>
      </el-form-item>
      <el-form-item label="安全码">
        <el-input v-model="form.safeNumber"></el-input>
      </el-form-item>
      <el-form-item label="有效期">
        <el-input v-model="form.expireDate"></el-input>
      </el-form-item>
      <!--          <el-form-item label="过期时间">-->
      <!--            <el-col :span="11">-->
      <!--              <el-date-picker type="date" placeholder="选择日期" v-model="form.expireDate" style="width: 100%;"></el-date-picker>-->
      <!--            </el-col>-->
      <!--          </el-form-item>-->
      <el-form-item>
        <el-button type="primary" @click="onSubmit">保存</el-button>
        <el-button>取消</el-button>
      </el-form-item>
    </el-form>
  </div>

</template>
<style scoped>
  .el-menu-vertical-demo:not(.el-menu--collapse) {
    width: 200px;
    min-height: 400px;
  }
</style>

<script>


  export default {
    name: 'card',
    data() {
      return {
        form: {
          bankName: '',
          cardNumber: '',
          expireDate: '',
          safeNumber: '',
          billDay: '',
          repaymentDay: '',
          amount: 0
        },

      };
    },
    methods: {
      handleOpen(key, keyPath) {
        console.log(key, keyPath);
      },
      handleClose(key, keyPath) {
        console.log(key, keyPath);
      },
      handleSelect(key, keyPath) {
        console.log(key, keyPath);
      },
      onSubmit() {
        var object = this.form
        this.$post('/card/api/card', this.$qs.parse(object))
          .then((response) => {
            console.log(response)
            this.$message('添加成功');
          })
          .catch(response => {
            console.log(response)
          })
      }
    }
  }


</script>

